<!--
- Author:  LiShibin.
- Date:    2018/9/17.
- File:    bankCard.
-->
<template>

  <div class="Web_Box3">
    <div class="Topmenu"><i @click="back" class="iconfont icon-youjiantou"><a href=""></a></i>
      <h1>招商加盟</h1>
      <span></span>
    </div>
    <div class="unionimg1"></div>
    <div class="unionimg2">
      <div class="unionipt">
        <p><span class="unionipt_name">姓名</span> &nbsp;<input type="text" v-model="unionSave.member_name" class="unionipt_input"></p>
        <p> <span class="unionipt_name">电话</span> &nbsp;<input type="text" v-model="unionSave.mobile" class="unionipt_input"></p>
        <p> <span class="unionipt_name">验证码</span> &nbsp;<input type="text" v-model="unionSave.code" class="unionipt_input1">
          <span class="union_yzm">
          <message-code type="2" :tel="unionSave.mobile" :sended-style="sendedStyle" :callback="handleMessageCode"></message-code>
        </span>
        </p>
        <p><span class="unionipt_name">投入预算</span> &nbsp;<input type="text" v-model="unionSave.investment_budget" class="unionipt_input"></p>
        <p><span class="unionipt_name">省份</span> &nbsp;<input type="text" v-model="unionSave.province" class="unionipt_input"></p>
        <p><span class="unionipt_name">城市</span> &nbsp;<input type="text" v-model="unionSave.city" class="unionipt_input"></p>
        <div class="unionbtn" @click="save" >提交信息</div>
      </div>

    </div>
  </div>

</template>

<script>
  import messageCode from '../../components/message-code.vue'
  import * as validator from '../../validator'

  export default{
    beforeRouteEnter (to, from, next) {
      next()
    },
    data() {
      return {
        from: this.$route.query.from || '',
        unionSave: {
          member_name: '',
          mobile: '',
          code: '',
          investment_budget: '',
          province: '',
          city: ''
        },
        payType: 0,
        sendedStyle: {color: '#595757'}
      }
    },
    components: {
      'message-code': messageCode
    },
    methods: {
      back() {
        this.$router.push({name: 'home'})
      },
      save() {
        if (this.unionSave.member_name === '') {
          this.$toast('请输入姓名')
          return
        }
        if (!validator.phone(this.unionSave.mobile)) {
          this.$toast('请输入正确的手机号')
          return
        }
        if (!this.unionSave.investment_budget) {
          this.$toast('请输入您的预算')
          return
        }
        if (!this.unionSave.province) {
          this.$toast('请输入省份')
          return
        }
        if (!this.unionSave.city) {
          this.$toast('请输入城市')
          return
        }
        this.$request.addUnion(this.unionSave).then(data => {
          this.$storage.setKey(data.key) // 测试用
          this.$toast('申请成功')
          this.$router.go(-1)
        }).catch(e => {
          this.$toast('提交失败:' + e.msg)
        })
      },
      handleMessageCode() {
        console.log('1')
      }
    }
  }
</script>
